<template>
	<view class="share" v-if="shareStatus">
		<view class="shareMain">
			<view class="defaultShare flex alignCenter">
				<view class="scrollItem" v-for="(item,index) in shareData" :key="index" @click="shareClick(item)">
					<image class="scrollImg" :src="item.src" mode="widthFix"></image>
					<view class="font14">{{item.name}}</view>
				</view>
			</view>
			<view class="moreShare flex alignCenter scrollMore" v-if="showMoreOper">
				<view class="scrollItem" v-for="(item,index) in actionData" :key="index">
					<view class="operIcon">
						<image class="scrollImg" :src="item.src"></image>
					</view>
					<view class="font14">{{item.name}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"uni-share",
		props:{
			showMoreOper:{
				type:Boolean,
				default:true
			},
			// shareStatus:{
			// 	type:Boolean,
			// 	default:false
			// },
		},
		data() {
			return {
				shareStatus:false,
				// showMoreOper:true,
				shareData: [{
						src: 'https://image.alhelp.net/uploads/20231104/4640f16054094683f46c6884e3162f0b.png',
						name: '微信',
						type:'WXSceneSession'
					},
					{
						src: 'https://image.alhelp.net/uploads/20231104/4dd6b13a7e0e1d128d5d27f05f11fca0.png',
						name: '朋友圈',
						type:'WXSceneTimeline'
					},
					// {
					// 	src: '/static/image/share/qq_k.png',
					// 	name: 'QQ空间'
					// },
					// {
					// 	src: '/static/image/share/qq.png',
					// 	name: 'QQ'
					// },
					// {
					// 	src: '/static/image/share/weibo.png',
					// 	name: '微博'
					// },
					{
						src: '/static/image/share/sss-2.png',
						name: '保存至相册',
						type:'camera'
					},
				],
				actionData: [{
						src: '/static/image/share/sss-1.png',
						name: '举报'
					},
					// {
					// 	src: '/static/image/share/sss-2.png',
					// 	name: '保存至相册'
					// },
					{
						src: '/static/image/share/sss-3.png',
						name: '收藏'
					},
					{
						src: '/static/image/share/sss-4.png',
						name: '不感兴趣'
					},
					{
						src: '/static/image/share/sss-5.png',
						name: '复制链接'
					},
					{
						src: '/static/image/share/sss-6.png',
						name: '二维码'
					},
				],
			};
		},
		created() {
			// #ifdef MP
			this.shareData=[{
				src: '/static/image/share/sss-2.png',
				name: '保存至相册',
				type:'camera'
			}]
			// #endif
		},
		methods:{
			show(){
				this.shareStatus=true
			},
			cancelOper(){
				this.shareStatus=false
			},
			shareClick(item){
				this.$emit("shareClick",item)
			}
		}
	}
</script>
<style lang="scss" scoped>
.share{
	position: fixed;
	left:0;
	bottom:0;
	background: rgba(0, 0, 0, .1);
	width: 100%;
	// height: 100%;
	z-index: 2000;
}
.shareMain{
	text-align: center;
	background: rgba(0, 0, 0, .8);
	color:#fff;
	position: absolute;
	left: 0;
	bottom:0;
	padding: 15rpx 0;
	width: 100%;
	box-sizing: border-box;
	border-radius: 40rpx 40rpx 0 0;
	.defaultShare,
	.moreShare{
		padding: 20rpx 0;
		box-sizing: border-box;
		overflow-y: scroll;
	}
	.scrollItem{
		text-align: center;
		padding: 10rpx 30rpx;
		box-sizing: border-box;
		flex-shrink: 0;
		.scrollImg{
			width: 80rpx;
			height: 80rpx;
		}
	}
	.scrollMore{
		border-top:1px solid #363636;
		.operIcon{
			width: 100rpx;
			height: 100rpx;
			border-radius: 50%;
			text-align: center;
			background-color: #373737;
			padding: 20rpx;
			box-sizing: border-box;
			margin: 0 auto;
		}
		.scrollImg{
			width: 60rpx;
			height: 60rpx;
		}
	}
}
</style>